<template>
  <el-card shadow="never" class="aui-card--fill">
    <h3 v-if="showNo" style="margintop: 0">{{ $route.params.mtNo }}</h3>
    <div class="mod-wms__order-detail}">
      <el-upload :action="uploadUrl" :on-change="handleChange" style="margin-bottom: 10px">
        <el-button size="small" type="primary" plain>点击上传</el-button>
      </el-upload>
      <wms-form v-model="dataForm" :formList="formList" :table-column="tableColumn" :advanced="advanced"
        @check-change="checkChange" @changeAdvance="changeAdvance" @getDataList="getDataList" @getReset="getReset">
        <template>
          <el-button size="mini" type="primary" plain @click="outOrderFirstClick">工单首套料出库
          </el-button>
          <el-button size="mini" type="primary" plain @click="outOrderClick">工单出库
          </el-button>
          <el-button size="mini" type="primary" plain @click="outUgClick">紧急出库
          </el-button>
          <el-button size="mini" type="primary" plain @click="outLotClick">批量出库
          </el-button>
          <el-button size="mini" type="primary" plain @click="exportHandle">导出记录
          </el-button>
        </template>
      </wms-form>
      <wms-table ref="wmsTable" class="wmsTable" v-model="dataForm" :page="page" :total="total" :limit="limit"
        :tableData="dataList" :table-column="column" :module-options="mixinViewModuleOptions"
        :dataListLoading="dataListLoading" :showSelection="showNo" @deleteHandle="deleteHandle"
        @distributionHandle="distributionHandle" @allotDetailsHandle="allotDetailsHandle"
        @pageSizeChangeHandle="pageSizeChangeHandle" @pageCurrentChangeHandle="pageCurrentChangeHandle"
        @selectChangeHandle="selectChangeHandle">
      </wms-table>
      <!-- 弹窗, 新增 / 修改 -->
      <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
      <manual-allot v-if="distributionVisable" ref="distribution" @refreshDataList="getDataList"></manual-allot>
      <allot-details v-if="allotDetailsVisable" ref="allotDetails" @refreshDataList="getDataList"></allot-details>
    </div>
  </el-card>
</template>

<script>
import mixinViewModule from "@/mixins/view-module";
import AddOrUpdate from './components/order-detail-add-or-update'
import manualAllot from "./components/distribution.vue";
import allotDetails from "./components/allot-details.vue";
import { formList, tableColumn } from "./config";
import wmsTable from "@/components/wms-table";
import wmsForm from "@/components/wms-form";
export default {
  mixins: [mixinViewModule],
  data() {
    return {
      mixinViewModuleOptions: {
        createdIsNeed: false,
        getDataListURL: "/wms/order-detail/page",
        getDataListIsPage: true,
        exportURL: "/wms/order-detail/export",
        deleteURL: "/wms/order-detail",
        deleteIsBatch: true,
        deleteIsBatchKey: "detailId",
      },
      formList,
      tableColumn,
      showNo: true,
      detailId: '',
      dataForm: {
        detailId: "",
        orderId: "",
      },
      distributionVisable: false,
      allotDetailsVisable: false,
      ids: [],
      //存放上传文件
      fileList: [],
      uploadUrl: '/wms/order-detail/import',
      outForm: {
        detailId: null,
        requestType: '3',
        stn: '',
      },
      ugForm: {
        detailIds: [],
        requestType: '4',
        stn: '',
      },
      outUrl: '/wms/task/request-out',
      maxFileLength: 1

    };
  },
  components: {
    AddOrUpdate,
    manualAllot,
    allotDetails,
    wmsTable,
    wmsForm,
  },
  created() {
    if (this.$route.params.dtId) {
      this.showNo = true;
      this.dataForm.orderId = this.$route.params.dtId;
    }
    this.query();
  },
  methods: {

    handleChange(file, fileList) {
      let length = fileList.length;
      this.maxFileLength = Math.max(length, this.maxFileLength)
      setTimeout(() => {
        if (this.maxFileLength !== length) {
          return
        }
        fileList.forEach(item => {
          this.fileList.push(item.raw)
          // 文件选择后的回调
          this.uploadFile(file.raw); // 直接上传文件
        })
      }, 0)
    },
    beforeUpload(file) {
      // 如果需要的话，可以在这里进行文件校验
      // return false 则停止上传
    },
    uploadFile(file) {
      const formData = new FormData();
      formData.append('file', file);
      this.$http.post(this.uploadUrl, formData, {
        headers: {
          'Content-Type': 'multipart/form-data'
        }
      }).then(({ data: res }) => {
        if (res.code != 0) {
          return this.$message.error(res.msg);
        }
        this.$message({
          message: res.msg,
          type: "success",
          duration: 5000,
          onClose: () => {
            this.getDataList();
          },
        });
      })
        .catch(error => {
          console.error('上传失败', error);
        });
    },

    // 单选
    selectChangeHandle(selection, row) {
      this.detailId = ""; //每次单选都重置id
      // if (selection.length > 1) {
      //   this.$refs["wmsTable"].$refs.Table.clearSelection();
      //   this.$refs["wmsTable"].$refs.Table.toggleRowSelection(row);
      // }
      // if (selection.length != 0) {
      //   //只有当真正选中了目标主单才获取id
      //   this.detailId = row.detailId;
      //   this.outForm.detailId = row.detailId;
      // }
      this.outForm.stockIds = null
      if (selection.length > 0) {
        //支持多选
        this.ugForm.detailIds = selection.map(item => item.detailId)
        this.detailId = row.detailId;
        this.outForm.detailId = row.detailId;
      }
      else {
        this.ugForm.detailIds = []
        this.detailId = null;
        this.outForm.detailId = null;
      }
    },

    //工单出库
    outOrderFirstClick() {

      this.outForm.stn = this.$store.state.user.stn
      if (this.outForm.detailId == null) {
        this.$message({

          message: '请选择工单',
          type: 'error',
          center: true,
          showClose: true
        })
        //this.$refs.callAgvItemID.focus();
      }
      else {
        
        this.outForm.requestType = "5" //臨時賦值5

        this.$http['post'](this.outUrl, this.outForm).then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message({
              message: res.msg,
              type: 'error',
              duration: 5000,
            })
          }
          this.$message({
            message: res.data,
            type: 'success',
            duration: 5000,
            onClose: () => {
              this.visible = false
              //this.$emit('refreshDataList')
            }
          })
        }).catch(() => { })
      }
    },

    //工单出库
    outOrderClick() {

      this.outForm.stn = this.$store.state.user.stn
      if (this.outForm.detailId == null) {
        this.$message({

          message: '请选择工单',
          type: 'error',
          center: true,
          showClose: true
        })
        //this.$refs.callAgvItemID.focus();
      }
      else {
        this.outForm.requestType = "3" //賦值3
        this.$http['post'](this.outUrl, this.outForm).then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message({
              message: res.msg,
              type: 'error',
              duration: 5000,
            })
          }
          this.$message({
            message: res.data,
            type: 'success',
            duration: 5000,
            onClose: () => {
              this.visible = false
              //this.$emit('refreshDataList')
            }
          })
        }).catch(() => { })
      }
    },

    outLotClick() {
      this.outForm.stn = this.$store.state.user.stn
      if (this.outForm.detailId == null) {
        this.$message({

          message: '请选择數據',
          type: 'error',
          center: true,
          showClose: true
        })
        //this.$refs.callAgvItemID.focus();
      }
      else {
        this.outForm.requestType = "6" //賦值6
        this.$http['post'](this.outUrl, this.outForm).then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message({
              message: res.msg,
              type: 'error',
              duration: 5000,
            })
          }
          this.$message({
            message: res.data,
            type: 'success',
            duration: 5000,
            onClose: () => {
              this.visible = false
              //this.$emit('refreshDataList')
            }
          })
        }).catch(() => { })
      }
    },

    outUgClick() {

      this.ugForm.stn = this.$store.state.user.stn
      if (this.ugForm.detailIds.length == 0) {
        this.$message({

          message: '请选择数据',
          type: 'error',
          center: true,
          showClose: true
        })
        //this.$refs.callAgvItemID.focus();
      }
      else {

        this.$http['post'](this.outUrl, this.ugForm).then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message({
              message: res.msg,
              type: 'error',
              duration: 5000,
            })
          }
          this.$message({
            message: this.$t('prompt.success'),
            type: 'success',
            duration: 5000,
            onClose: () => {
              this.visible = false
              //this.$emit('refreshDataList')
              this.query()
              this.ugForm.detailIds = []
            }
          })
        }).catch(() => { })
      }
    }
  },
};
</script>
<style scoped>
/* 隐藏表头的全选框 */
/*::v-deep .wmsTable thead .el-table-column--selection .cell {
  display: none;
}*/

::v-deep .wmsTable thead .el-table-column--selection .cell {
  display: none;
}
</style>
